<template>
	<view class="container">
		<block v-if='type.length!=0'>
			<view class="padding-sm bg-white flex justify-between align-center" v-for="item in type"
				@click="toPage('/filePage/pages/news-list/news-list?type='+item.type)">
				<view class="flex justify-start align-center">
					<view style="position: relative;">

						<view class="new-count" v-if='item.count!=0'>
							{{item.count>=100?'99+':item.count}}
						</view>
						<image :src="baseUrl + '/static/notice2.png'" mode="" class="cu-avatar round lg"></image>
					</view>

					<view class="margin-left-sm">
						<view class="text-13 text-333">
							<block v-if='item.type==1'>系统消息</block>
							<block v-if='item.type==2'>订单消息</block>
							<block v-if='item.type==3'>订单评价</block>
							<block v-if='item.type==4'>我的关注</block>
							<block v-if='item.type==5'>我的投诉</block>
						</view>
						<view class="text-999 margin-top-xs text-sm">
							{{item.title}}
						</view>
					</view>
				</view>
				<view class="text-11 text-999">
					{{item.createTime}}
				</view>

			</view>
		</block>
		<block v-else>
			<view class="padding-sm  flex justify-center  align-center " style="color:#999">
				暂无消息...
			</view>
		</block>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				baseUrl: this.$config.baseUrl,
				type: []
			};
		},
		onShow() {
			this.getTypeList()
		},
		methods: {
			toPage(url) {
				this.$util.openNewPage(url)
			},
			async getTypeList() {
				const data = {
					userId: uni.getStorageSync('userId')
				}
				const [err, rs] = await this.$get(this.$api.typeList, data)
				if (rs) {
					this.type = rs.data
				}
			}

		}
	}
</script>

<style lang="scss" scoped>
	.new-count {
		position: absolute;
		right: -10rpx;
		top: -10rpx;
		z-index: 999;
		line-height: 28rpx;
		font-size: 20rpx;
		padding: 0rpx 10rpx;
		height: 28rpx;
	    border-radius: 200rpx;
		background-color: #FF3636;
		color: #fff;
	
	}
</style>
